<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
    />
    <title>专业数据大屏</title>
    <link rel="stylesheet" href="css/main.css" />
  </head>
  <body>
    <div class="dashboard">
      <!-- 头部 -->
      <header class="dashboard-header">
        <h1 class="title">智慧运营中心</h1>
        <div class="time-info">2025年03月 | 实时更新</div>
      </header>

      <!-- 主内容 -->
      <main class="dashboard-content">
        <section class="chart-container left">
          <div class="chart-card">
            <div class="chart-title">业务增长趋势</div>
            <div class="chart-area"></div>
          </div>
        </section>

        <section class="chart-container right">
          <div class="chart-card">
            <div class="chart-title">地域分布热力</div>
            <div class="chart-area"></div>
          </div>
        </section>
      </main>
    </div>

    <script>
      // 动态适配逻辑（保持原有）
      const DESIGN_WIDTH = 1920,
        DESIGN_HEIGHT = 1080;
      function adjustRootFont() {
        const scale = Math.min(
          window.innerWidth / DESIGN_WIDTH,
          window.innerHeight / DESIGN_HEIGHT
        );
        document.documentElement.style.fontSize = `${scale * 100}px`;
      }
    
      // 初始化监听
      window.addEventListener("resize", () => {
        requestAnimationFrame(() => {
          adjustRootFont();
        });
      });
      adjustRootFont();
    </script>
  </body>
</html>